WIP: Introduces a new design for web-inspector #2030
Conversation
This is an UI implementation to visualyze flow data that is being generated by Soletta. This patch adds the basic features/images of the tool. Signed-off-by: Ronaldo Pereira <[email protected]>
|
This is a WIP patch, please do not merge it already. It misses some needed functionalities. Could you guys please start reviewing this patch ? |
|
|
||
| this.name = params["name"]; | ||
| this.value = params["value"]; | ||
| this.type = params["type"] || "in"; |
There was a problem hiding this comment.
are you receiving empty type? That shouldn't happen
|
@ronaldosilva regarding licenses, please add it on all files, just like you have done with style.css It would be nice to have a license for image assets as well. Maybe CC or whatever that makes sense for you. I suppose you're doing the same on Soletta Dev-App. |
| this.raw = JSON.stringify(payload, null, 4); | ||
| this.key = key; | ||
| this.widgetName = payload.id; //change to 'name ?' | ||
| this.uid = payload.path[payload.path.length-1]; |
There was a problem hiding this comment.
ok, but you should also save payload.path somewhere and have some parenting/container. This will happen when you have flows that use sub flows. I'm not sure how to represent that in a nice graphical way. To the parent flow, the internal is represented as a single node with input and output ports. We can either "click to enter/expand" or show inlined with some graphical delimiter.
|
@ronaldosilva nice work, man! I did many comments (as usual in my reviews) and I believe the engineers can help a bit to improve the data structures in the JS, but that's minor. Keep working and once you're happy with the inspector UX we can help with that. |
|
|
||
| 'use strict' | ||
|
|
||
| function Modal(){ |
There was a problem hiding this comment.
split the { from the Modal()
function Modal() {
| this.widget = params["widget"]; | ||
| this.port_index = params["port_index"]; | ||
| this.required = params["required"] || true; | ||
| this.key = "port_" + this.type + "_" + params["key"]; |
There was a problem hiding this comment.
All these parameters should be written in dot notation instead of using ['key']
It would be something like this:
this.required = params.required;
You can see more info about this here:
https://jslinterrors.com/a-is-better-written-in-dot-notation
|
@ronaldosilva, I just reviewed and your patch is awesome, I just mentioned minor things... Thanks! |
This is an UI implementation to visualyze flow data that
is being generated by Soletta.
This patch adds the basic features/images of the
tool.
Signed-off-by: Ronaldo Pereira [email protected]